<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript"></script>
    <style type="text/css"></style>
    <title>Document</title>
</head>

<body>
    <div class="container">
        <div class="row">
            <h2>表单</h2>
        </div>
    </div>

    <div class="container">

        <div class="row">
            <!--             <form action="" role="form">
                <div class="form-group">
                    <label for="username">username:</label>
                    <input type="text" name="" class="form-control" id="username">
                </div>
                <div class="form-group">
                    <label for="password">password:</label>
                    <input type="password" name="" class="form-control" id="password">
                </div>

            </form>

            <br>
            <br>
            <form action="" role="form" class="form-inline">
                <div class="form-group">
                    <label for="username1">username:</label>
                    <input type="text" name="" class="form-control" id="username1">
                </div>
                <div class="form-group">
                    <label for="password1">password:</label>
                    <input type="password" name="" class="form-control" id="password1">
                </div>

            </form>

            <br>
            <br>
            <form action="" role="form" class="form-horizontal">
                <div class="form-group">

                    <label for="username2" class="col-sm-2">username:</label>
                    <div class="col-sm-10">
                        <input type="text" name="" class="form-control" id="username2">
                    </div>

                </div>
                <div class="form-group form-group-lg">
                    <label for="password2" class="col-sm-2">password:</label>
                    <div class="col-sm-10">
                        <input type="password" name="" class="form-control" id="password2">
                    </div>
                </div>

            </form>
 -->

            <!--表单控件组-->
            <form action="" role="form">

                <div class="input-group">
                    <span class="input-group-addon">@</span>
                    <input type="text" value="" class="form-control">

                </div>

                <br>
                <br>
                <br>
                <div class="input-group">
                    <input type="text" value="" class="form-control">

                    <span class="input-group-btn">
                        <input type="button" value="搜索" class="btn btn-primary">
                    </span>
                </div>
                <br>
                <br>
                <br>
                <div class="input-group">
                    <input type="text" value="" class="form-control">

                    <span class="input-group-btn">
                        <button class="btn btn-primary"><span class="glyphicon glyphicon-heart"></span></button>
                    </span>
                </div>



            </form>





        </div>
    </div>



</body>

</html>